﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>1.0.登陆</title>
    <script type="text/javascript" src="../../Content/highlighter/scripts/shCore.js"></script>
    <script type="text/javascript" src="../../Content/highlighter/scripts/shBrushCSharp.js"></script>
    <script type="text/javascript" src="../../Content/highlighter/scripts/shBrushXml.js"></script>
    <link type="text/css" rel="stylesheet" href="../../Content/highlighter/styles/shCoreDefault.css"/>
    <script type="text/javascript">SyntaxHighlighter.all();</script>
</head>
<body>
    <h3>1.控制器的定义</h3>
    当安装完NFinal后,在Controllers目录下加入upload类，内容为：<br/>
    <pre class="brush: csharp;">
        public class upload:Controller
        {
            public void show()
            {
                View("show.aspx");
            }
        }
    </pre>
    <p>
	 2.然后添加视图：
    </p>
    <pre class="brush: html">
        &lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="show.aspx.cs" Inherits="WebApplication1.DDD.Views.Default.upload.show" %>
        &lt;%@ Register Src="~/DDD/Views/Default/Common/Public/KindEditorLibrary.ascx" TagPrefix="uc1" TagName="KindEditorLibrary" %>
        &lt;!DOCTYPE html>

        &lt;html xmlns="http://www.w3.org/1999/xhtml">
        &lt;head runat="server">
        &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
                &lt;title>&lt;/title>
                &lt;uc1:KindEditorLibrary runat="server" id="KindEditorLibrary" />
        &lt;/head>
        &lt;body>
            &lt;form id="form1" runat="server">
            &lt;div>
                &lt;img id="img" src="#" width="200" height="200" />
                &lt;input id="imgsrc" name="imgsrc" type="hidden" />
                &lt;input type="button" data-type="upload-img" data-img="img" data-input="imgsrc" value="upload" />
            &lt;/div>
            &lt;/form>
        &lt;/body>
        &lt;/html>
    </pre>
    2.右键点击WebCompiler.aspx.选择在浏览器中查看.
    <p>
        生成开始<br />生成结束
    </p>
    3.找到解决方案资源管理器，展开Web文件夹下的Default文件夹。<br/>
	点击显示所有文件按钮，使其激活。则可看到upload文件夹，<br/>
	其下有show.cs和show.html等文件<br/>
	如果未看到，请选择该目录并点击刷新按钮。<br/>
	<img src="../../Content/images/显示所有文件.gif" width="323" height="76"/><br/>
    右键点击upload文件夹,选择包括在项目中,其中show.html的代码如下.<br/>
    <pre class="brush: csharp;">
        ﻿﻿&lt;!DOCTYPE html>
        &lt;html xmlns="http://www.w3.org/1999/xhtml">
        &lt;head>
        &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
                &lt;title>&lt;/title>
                &lt;meta http-equiv="Cache-Control" content="no-cache">
                &lt;script src="/Scripts/jquery-1.11.2.min.js">&lt;/script>
        &lt;/head>
        &lt;body>
                <script>
                $.getScript("/Scripts/Url.js?_" + Math.random(), function () {
                    //生成URL所用的js函数是由NFinal自动生成
                    window.location.href = Url.DDD_upload_show();
                });
	        </script>
        &lt;/body>
        &lt;/html>
    </pre>
    Show.cs中的代码如下:
    <pre class="brush: csharp;" type="text/template">
        public void show()
        {
			Write("<!DOCTYPE html><html xmlns=\"http://www.w3.org/1999/xhtml\"><head runat=\"server\"><meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" /><title></title> ﻿");
			Write("<link rel=\"stylesheet\" href=\"");
            Write(_app);
            Write("/Content/kindeditor/themes/default/default.css\" /><link rel=\"stylesheet\" href=\"");
            Write(_app);
            Write("/Content/kindeditor/plugins/code/prettify.css\" /><script charset=\"utf-8\" src=\"");
            Write(_app);
            Write("/Content/kindeditor/kindeditor.js\"></script><script charset=\"utf-8\" src=\"");
            Write(_app);
            Write("/Content/kindeditor/lang/zh_CN.js\"></script><script charset=\"utf-8\" src=\"");
            Write(_app);
            Write("/Content/kindeditor/plugins/code/prettify.js\"></script><script>KindEditor.ready(function (K) { K.create(\"textarea[data-type=\'kindeditor\']\", { cssPath: \'");
			Write(_app);
			Write("/Content/kindeditor/plugins/code/prettify.css\', uploadJson: \'");
			Write(_app);
			Write("/Content/kindeditor/asp.net/upload_json.ashx\', fileManagerJson: \'");
			Write(_app);
			Write("/Content/kindeditor/asp.net/file_manager_json.ashx\', allowFileManager: true }); prettyPrint(); K(\"input[data-type=\'upload-img\']\").each(function () { var upload = K(this); var img = K(this).attr(\'data-img\'); var input = K(this).attr(\'data-input\'); var uploadbutton = K.uploadbutton({ button: upload, fieldName: \'imgFile\', url: \'");
			Write(_app);
			Write("/Content/kindeditor/asp.net/upload_json.ashx\', afterUpload: function (data) { if (data.error === 0) { if (img != \"\") { K(\'#\' + img).attr(\'src\', data.url); } if (input != \"\") { K(\'#\' + input).val(data.url); } } else { alert(data.message); } } }); uploadbutton.fileBox.change(function (e) { uploadbutton.submit(); }); }); }); </script></head><body><form id=\"form1\" runat=\"server\"><div><img id=\"img\" src=\"#\" width=\"200\" height=\"200\" /><input id=\"imgsrc\" name=\"imgsrc\" type=\"hidden\" /><input type=\"button\" data-type=\"upload-img\" data-img=\"img\" data-input=\"imgsrc\" value=\"upload\" /></div></form></body></html>");
        }
    </pre>
    <p>
        show中的代码只是跳转并执行upload下的show方法.
    </p>
    <p>
        4.右键点击show.html并选择在浏览器中查看,点击上传按钮上传图片.<br />
        <img src="../../Content/images/setup/img-upload.gif"/>
    </p>
</body>
</html>